<template>
    <div class="topBar">
        <van-nav-bar 
        :title="title"
        fixed>
        <template #left>
            <div class="nav-left" @click="toUserCentre()">
                <div class="nav-btn">
                    <van-icon :name="rightIconUser"></van-icon>
                </div>
            </div>
        </template>
            <template #right>
                <div class="nav-right" @click="toBulletin()">
                    <div class="nav-btn">             
                        <van-icon :name="rightIcon"></van-icon>
                    </div>
                </div>
            </template>
        </van-nav-bar>
    </div>
</template>

<script>
import {Dialog, Toast} from "vant";

export default {
    name:'TopBar',
    data(){
        return{
        };
    },
    //title用来显示导航栏的title,isleftarrow用来显示导航栏的左侧箭头
    props: [
        "title",
        "rightIcon",
        "rightIconUser"
        ],
    methods:{
      //点击消息列表跳转至公告页面
      toBulletin(){
        if (this.$store.getters.userRoleInfo === 'ROLE_admin' || this.$store.getters.userRoleInfo === 'ROLE_user'){
          //跳转到发现页面
          this.$router.push({
            name:'Papers'
          })
          //切换tab
          this.$store.commit("changeBulletinInfo","bulletin");
        }else {
         Toast.fail({
           message:'权限不足',
           duration:1000
         })
        }
      },
      //跳转到用户中心
      toUserCentre(){
        this.$router.push({
          name:"Setting"
        })
      }
    },
}
</script>

<style scoped>

</style>